<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>联系人列表 - 学生通讯录系统</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/style.css">
</head>
<body>
    <div class="container">
        <header>
            <h1>学生通讯录系统</h1>
        </header>

        <nav>
            <ul>
                <li><a href="${pageContext.request.contextPath}/listContacts">查看所有联系人</a></li>
                <li><a href="${pageContext.request.contextPath}/addContact">添加联系人</a></li>
                <li><a href="${pageContext.request.contextPath}/index.jsp">返回首页</a></li>
                <li><a href="${pageContext.request.contextPath}/saveContactsToFile">导出到文件</a></li>
                <li><a href="${pageContext.request.contextPath}/loadContactsFromFile">从文件导入</a></li>
            </ul>
        </nav>

        <main>
            <section class="search-section">
                <h2>联系人查询</h2>
                
                <c:if test="${not empty message}">
                    <div class="message">
                        <p>${message}</p>
                    </div>
                </c:if>
                <div class="search-container">
                    <form action="${pageContext.request.contextPath}/searchByName" method="get">
                        <div class="form-group">
                            <label for="name">按姓名查询：</label>
                            <input type="text" id="name" name="name" placeholder="请输入姓名" value="${searchName}">
                            <button type="submit">查询</button>
                        </div>
                    </form>

                    <form action="${pageContext.request.contextPath}/searchByStudentId" method="get">
                        <div class="form-group">
                            <label for="studentId">按学号查询：</label>
                            <input type="text" id="studentId" name="studentId" placeholder="请输入学号" value="${searchStudentId}">
                            <button type="submit">查询</button>
                        </div>
                    </form>
                </div>
            </section>

            <section class="contact-list">
                <h2>联系人列表</h2>

                <c:if test="${empty contactList}">
                    <p class="no-data">暂无联系人数据</p>
                </c:if>

                <c:if test="${not empty contactList}">
                    <table>
                        <thead>
                            <tr>
                                <th>序号</th>
                                <th>学号</th>
                                <th>姓名</th>
                                <th>年级</th>
                                <th>联系方式</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody>
                            <c:forEach items="${contactList}" var="contact" varStatus="status">
                                <tr>
                                    <td>${status.index + 1}</td>
                                    <td>${contact.studentId}</td>
                                    <td>${contact.name}</td>
                                    <td>${contact.grade}</td>
                                    <td>${contact.contactInfo}</td>
                                    <td>
                                        <a href="${pageContext.request.contextPath}/updateContact?studentId=${contact.studentId}" class="btn btn-edit">编辑</a>
                                        <a href="javascript:void(0);" onclick="confirmDelete('${contact.studentId}', '${contact.name}')" class="btn btn-delete">删除</a>
                                    </td>
                                </tr>
                            </c:forEach>
                        </tbody>
                    </table>
                </c:if>
            </section>
        </main>

        <footer>
            <p>2025  学生通讯录系统 - 南昌大学共青学院</p>
        </footer>
    </div>

    <script>
        function confirmDelete(studentId, name) {
            if (confirm('确定要删除学号为 ' + studentId + '，姓名为 ' + name + ' 的联系人吗？')) {
                window.location.href = '${pageContext.request.contextPath}/deleteContact?studentId=' + studentId;
            }
        }
    </script>
</body>
</html>
